﻿@model QBWeb.ViewModels.PaperViewModels
@{
    ViewBag.Title = "在线考试";
}
<link rel="stylesheet" type="text/css" href="~/Content/index.css">
<style>
    .box {
        width: 500px;
        min-height: 100px;
    }
</style>
@*<script type="text/javascript" src="~/Scripts/Questions.js"></script>*@
<div class="row">
    <div class="col-md-1"></div>
    <div class="col-md-10">
        <div class="content">
            <!--上方按钮-->
            <div class="row" style="margin: 20px 0 0">
                <div class="btn-group">
                    <button class="btn btn-default" type="button" onclick="history.go(-1);">返回上一个页面</button>
                    <button class="btn btn-default" type="button" onclick="location.reload();">刷新</button>
                </div>
            </div>
            <!--下面试卷显示-->
            <div class="show">
                <div style="width: 100%">
                    <div style="width: 80%;margin: 0px auto;">
                        <!--上方进度条显示-->
                        <div class="title">
                            <div class="middle-top">
                                <div class="middle-top-left pull-left" style="height: 100%;padding-left: 20px;background: #232C31;color: #cccccc;">
                                    <!--进度条-->
                                    <div class="text-center pull-left progress-left progress_show">
                                        <div class="progress pull-left" style="background: #609E53;width: 0px;height:18px;position:absolute;left: 0px;">
                                        </div>
                                        <div class="pro-text" style="left: 0px;color: #609E53;position: absolute;top: 0px;width:100%;">
                                            已完成<span class="progres"></span>
                                        </div>
                                    </div>
                                    <!--答题数量-->
                                    <div class="pull-left" style="width: 135px;line-height: 20px;height: 20px;margin: 15px;font-size: 15px">
                                        当前第<span class="questioned"></span>题/共<span class="question_sum"></span>题
                                    </div>
                                </div>
                                <div class="middle-top-right text-center pull-left"
                                     style="width:160px; height: 100%;border-left: 1px solid  red;position: absolute;right: 0px;">
                                    <div class="stop pull-left" style=" height: 100%; padding: 10px;">

                                        @*<a href="javascript:void(0);" class="text-center" style="color: #FE6547;">

                                            <div class="time-stop glyphicon glyphicon-pause" title="暂停"
                                                 style="width: 30px; height: 30px; line-height: 30px; border-radius: 15px; border: 1px solid #FE6547;">
                                            </div>
                                            <div class="time-start glyphicon glyphicon-play" title="开始"
                                                 style="width: 30px; height: 30px; line-height: 30px; border-radius: 15px; border: 1px solid #FE6547; display: none;">
                                            </div>
                                        </a>*@
                                        <span style="color: lightgray">距离交卷还有：</span>
                                        <div id="limitTime" style="color: white"></div>

                                    </div>
                                    @*<div class="pull-left" style="width: 100px; height: 100%;padding: 10px 0px 10px 0px;">
                                        <div class="time" style="width:100px;height: 30px;line-height:30px; border-radius:15px;font-size:20px;color:#0000ff;"> </div>
                                    </div>*@
                                </div>
                            </div>
                            <div style="width: 100%;height: 50px;font-size:15px;color: #000;line-height: 50px;padding-left: 20px;">
                                <div style="color:#FFF;background: red;width: 22px;height: 22px;border-radius:11px;line-height:22px;font-size:13px; text-align: center;"
                                     class="glyphicon glyphicon-map-marker"></div>
                                <span id="questionType"></span>
                            </div>
                        </div>
                        <!--试题显示-->
                        <div style="width: 100%;height:auto;display: inline-block;border: 1px solid #CCC;border-bottom:1px dashed #CCC;background:#FFF;">
                            <div style="width: 100%;height: 90%;padding:20px 20px 0px 20px;">
                                <!--试题区域-->
                                <ul class="list-unstyled question" id="" name="">
                                    <li class="question_title"></li>
                                </ul>
                                <!--考题的操作区域-->
                                <div class="operation" style="margin-top: 20px;">
                                    <div class="text-left"
                                         style="margin-left:20px;font-size: 15px;float: left;line-height: 30px;">
                                        <div id="unHeart" style="color:#999999;"> <span class="glyphicon glyphicon-heart-empty"></span> <span>收藏本题</span> </div>
                                        <div id="heart" style="color:#C40000;display: none;"> <span class="glyphicon glyphicon-heart"></span> <span>已收藏</span> </div>
                                    </div>
                                    <div class="text-right" style="margin-right: 20px;">
                                        <div class="form-group" style="color: #FFF;">
                                            <button class="btn btn-info" disabled="disabled" id="preQuestion">上一题</button>
                                            <button class="btn btn-info" id="nextQuestion">下一题</button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <!--展示答题卡-->
                        <div style="width: 100%;height:auto;display: inline-block;border: 1px solid #CCC;border-top:none;background:#FFF;">
                            <div style="width: 100%;padding:20px;">
                                <div class="panel-default">
                                    <div class="panel-heading" id="closeCard" style="color: #DCE4EC;font-size: 15px;display: none;background: none;">
                                        <span>收起答题卡</span> <span class="glyphicon glyphicon-chevron-up"></span>
                                    </div>
                                    <div class="panel-heading" id="openCard" style="font-size: 15px;background: none;">
                                        <span>展开答题卡</span> <span class="glyphicon glyphicon-chevron-down"></span>
                                    </div>
                                    <div id="answerCard" style="display: none;">
                                        <div class="panel-body form-horizontal" style="padding: 0px;">
                                            <ul class="list-unstyled">
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-1"></div>
</div>
<div class="row" style="margin-top: 10px" >
    <div class="col-md-12" style="text-align: center">
        <button class="btn btn-success " id="submitQuestions" onclick="SubmitAnswers()">确认完成</button>
    </div>
</div>
@*<script src="~/Scripts/exam-issue.js"></script>*@


<script>
    
    var TestPaperTbId = "@Model.TestPaperTb.Id";
    var ExamName ="@Model.TestPaperTb.TestName";
    var Creator = "@Model.TestPaperTb.Creator";
    var OnTime = "@Model.Issue.OnTime";
</script>

<script src="~/Scripts/TestPaper/StuExam.js"></script>